<template>
  <div>
      <button @click="hand">授权页面</button>
  </div>
</template>

<script>
import { getUserQQinfo, getUserQQlogin } from "@/api";
import {mapMutations} from 'vuex'
export default {
  created() {
    // console.log(this.$QQ);
    console.log(this.$route);
    // 得到 授权后的 Code
    // const code = this.$route.query.code
    // this.getQQAccessToken()
  },
  methods: {
          ...mapMutations(["setToken"]),

    // handClick() {
    //     /*
    //         QQ SDK 提供的 授权方法
    //         新打开一个页面 进行授权
    //     */
    //   this.$QQ.Login.showPopup({
    //     appId: "101850878",
    //     redirectURI: "http://localhost:8080/proxy",
    //   });
    // },
    getQQAccessToken() {
      const isLogin = this.$QQ.Login.check();
      console.log(isLogin);
      if (isLogin) {
        this.$QQ.Login.getMe( (openId, accessToken) => {
          console.log("openId:", openId, "accessToken:", accessToken);

          const params = {
            access_token: accessToken,
            openid: openId,
            oauth_consumer_key: "101850878", // QQ 互联 平台 appID
          };
          // 发送请求 获取QQ用户信息
          getUserQQinfo(params, (res) => {
            console.log("res:", res);

            const par = {
              openid: openId,
              username: res.data.nickname,
            };
            // 使用 QQ 信息 登录 获取 token
            getUserQQlogin(par, (res) => {
              console.log("token:", res);

              this.setToken({ token: res.data.token });
              // 登录完成 触发 获取用户信息
              this.$store.dispatch("getInfo");
              this.$store.dispatch("getCartData");
              this.$router.replace("/me");
            });
          });
        });
      }
    },
  },
};
</script>

<style>

</style>